<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>小米商城</title>
        <link rel="stylesheet" href="mi.css">
        <style type="text/css">
            body{
                background-color: #e6e6e6;
            }
            .title{
                width:80%;margin: 0 auto;
                font-size: 22px;
                font-weight: 200;
                line-height: 58px;
                height: 58px;
                color: #333;}
            .all{
                font-size: 16px;margin-top: -58px;
            }
            .wrapper{width: 1226px;
            height: 614px;margin: auto;margin-top: 10px;}
            .spe{
                height: 604px;background-image: url("https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/574c6643ab91c6618bfb2d0e2c761d0b.jpg?thumb=1&w=234&h=614&f=webp&q=90");
                background-size: cover;margin-top: 10px;
            }
            .normal{height: 604px;margin-top: 10px}
            .first{height: 297px;width: 100%;background-color: #e6e6e6;}
            .second{height: 297px;width: 100%;margin-top: 10px;background-color: #e6e6e6;}
            .item{background-image: url("phone.png");background-repeat: no-repeat;
            height: 297px;background-size: cover;}
            .spe:hover{
                margin-top: 5px;
            }
            .item:hover{
                margin-top: -5px;
                box-shadow: 0 5px 10px 5px grey;
            }
        </style>
    </head>
    <body>
        <div class="title">
            <div class="phone">手机</div>
            <div class="all offset-10-9">查看全部></div>
        </div>
        <div class="wrapper">
            <div class="spe cell-8-2"></div>
            <div class="normal cell-8-6">
                   <div class="first">
                        <div class="item cell-4-1"></div>
                        <div class="item cell-4-1"></div>
                        <div class="item cell-4-1"></div>
                        <div class="item cell-4-1"></div>
                   </div>
                <div class="second">
                    <div class="item cell-4-1"></div>
                    <div class="item cell-4-1"></div>
                    <div class="item cell-4-1"></div>
                    <div class="item cell-4-1"></div>
                </div>
            </div>
        </div>
    </body>
</html>